
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>客户列表</title>
</head>
<body>
<div id="box">
    <div class="box">
        <h2>客户信息</h2>
        <form action="/addCustomer" method="post">
            <div class="inputBox">
                <label>ID:</label>
                <input style="padding-left: 27px;font-size: 19px" type="text" value="${customer.id}" name="id"/>
            </div>
            <div class="inputBox">
                <label>姓名：</label>
                <input style="padding-left: 40px;font-size: 18px" type="text" value="${customer.username}" name="username"/>
            </div>
            <div class="inputBox">
                <label>电话号码：</label>
                <input style="padding-left: 70px;font-size: 19px" type="text" value="${customer.telephone}" name="telephone"/>
            </div>
            <div class="inputBox" >
                <label>性别:</label>
                <input style="padding-left: 40px;font-size: 18px" type="text" value="${customer.sex}" name="sex"/>
            </div>
            <div class="inputBox">
                <label>年龄：</label>
                <input style="padding-left: 40px;font-size: 19px" type="text" value="${customer.age}岁" name="age">
            </div>
        </form>
    </div>
</div>
</body>
</html>
<style type="text/css">
    body
    {
        margin:0;
        padding: 0;
        font-family: sans-serif;
        background-image: url("../../result.png");
        background-size: cover;
    }
    .box
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width:400px;
        padding: 40px;
        background:rgba(0,0,0,.8);
        box-sizing:border-box;
        box-shadow:0 15px 25px rgba(0,0,0,.5);
        border-radius: 10px;/*登录窗口边角圆滑*/
    }
    .box h2
    {
        margin:0 0 30px;
        padding:0;
        color:#fff;
        text-align:center;
    }
    .box .inputBox
    {
        position:relative;
    }
    .box .inputBox input
    {
        width: 100%;
        padding: 10px 0;
        font-side:16px;
        color: #fff;
        letter-spacing: 1px;
        margin-bottom:30px;/*输入框设置*/
        border:none;
        border-bottom:1px solid #fff;
        outline:none;
        background:transparent;
    }
    .box .inputBox label
    {
        position: absolute;
        top: 0;
        left: 0;
        padding: 10px 0;
        font-size: 16px;
        color: #fff;
        pointer-events: none;
        transition: .5s;
    }
    .box .inputBox input:focus ~ label,
    .box .inputBox input:valid ~ label
    {
        top: -18px;
        left: 0;
        color: #03a9f4;
        font-size: 12px;
    }
    .box  input[type="submit"]
    {
        background: transparent;
        border: none;
        outline: none;
        color: #fff;
        background: #03a9f4;
        padding: 10px 20px;
        cursor: pointer;
        border-radius: 5px;
    }
    .last{
        padding-top: 30px;
        padding-left: 130px;
    }
    .box .inputText select
    {
        border: 0;
        padding: 10px 10px;
        border-bottom: 1px solid white;
        background-color: #00000000;
        text-align: center;
        color: white;
        width: 200px;
        height: 40px;
        font-size: 15px;
    }


</style>
